<template>
	<div class="mb-5" v-if="popupTitle==10||typeing=='入库单'">
		<el-button type="primary" @click="onAdd"  size="small">
			<template #icon>
				<icon name="el-icon-Plus" />
			</template>
			新增物料
		</el-button>
	</div>
	<mtable :data="tableLists" ref="tabless" :type="typeTable2" :list="options.tableTiles" :rowtype="true" :bill="false"
		:operation="false" :tableheight="'470'" :selection="true" @handleAdds="handleAddss"
		@onSelectionchanges="onSelectionchanges" @rowClickFunc="rowClickFunc">
		<template #tool="{item}">
			<el-table-column v-if="item.display==1" sortable :label="item.name" show-overflow-tooltip :prop="item.value"
				:width="item.width">
				<template #default="{ row }">
					<div v-if="item.name=='库存数量'">
						<span v-if="row.category_id==15">
							{{row.quantity_num}}{{row.unit_name_15}}
						</span>
						<span v-else>
							{{row.quantity_num}}{{row.unit_name}}
						</span>
					</div>
					<div v-if="item.name=='从属设备'">
						<el-button @click="onHovertitles(row)" v-if="row.slave_name" size="small">
							{{row.slave_name}}
						</el-button>
					</div>
					<template v-if="item.name=='名称'&&popupTitle==20">
						<el-button @click="onHovertitle(row)" size="small">{{row.title}}</el-button>
					</template>
					<div v-if="item.name=='分类'">
						<span>{{ booktypefilter(row.cate_name,row.category_id) }}</span>
					</div>
				</template>
			</el-table-column>
		</template>
	</mtable>
	<EdittablePopup v-if="showTabless" ref="editRefss" :type="typeTable2" @success="getOptions"
		@close="showTabless=false" />
	<edit-popup v-if="showEdit" ref="editRef" @success="onsuccess" @close="showEdit = false" />
	<tableHovertitle v-if="Hovertitle" ref="HovertitleRef" @success="getLists" @close="Hovertitle = false">
	</tableHovertitle>
</template>

<script lang="ts" setup>
	import tableHovertitle from '@/components/table-hovertitles/index.vue'
	import mtable from '@/components/table/index.vue'
	import {
		getCommonFieldDisplay
	} from '@/api/tools/code'
	import EdittablePopup from '@/components/settable/index.vue'
	import EditPopup from '../../materials/list/edit.vue'
	import useAppStore from '@/stores/modules/inventory'
	const userStore = useAppStore()
	const typeing = computed(() => userStore.typeing)
	const props = defineProps(['tableLists', 'typeTable2','popupTitle'])
	const emit = defineEmits(['onSelectionchange', 'rowClickFunc', 'onsuccess'])
	const editRefss = shallowRef < InstanceType < typeof EdittablePopup >> ()
	const editRef = shallowRef < InstanceType < typeof EditPopup >> ()
	const tabless = shallowRef < InstanceType < typeof EdittablePopup >> ()
	const showTabless = ref(false)
	const options = reactive({
		listall: [] as any[],
		tableTile: [] as any[],
		tableTiles: [] as any[]
	})
	const Hovertitle = ref(false)
	const HovertitleRef =ref()
	const onHovertitle = async (data : any) => {
		Hovertitle.value = true
		await nextTick()
		HovertitleRef.value?.open('edit')
		HovertitleRef.value?.setFormData(data)
	}
	const showEdit = ref(false)
	const onAdd = async () => {
		showEdit.value = true
		await nextTick()
		editRef.value?.open('add')
	}
	const handleAddss = async () => {
		showTabless.value = true
		await nextTick()
		editRefss.value?.open('add')
	}
	const onHovertitles = () => {}
	const booktypefilter = (list: any, id: any) => {
		if (list) {
			const obj = list.find((val: any) => val.id == id)
			return obj ? obj.name : null
		}
	}
	const onsuccess = () => {
		emit('onsuccess')
	}
	const onSelectionchanges = (val: any) => {
		emit('onSelectionchange', val)
	}
	const rowClickFunc = (row: any, ref: any) => {
		emit('rowClickFunc', row, ref)
	}
	const getOptions = () => {
		getCommonFieldDisplay({
			type: props.typeTable2
		}).then((data: any) => {
			options.tableTiles = data
		})
	}
	onMounted(() => {
		getOptions()
	})
</script>

<style>
</style>
